<!doctype html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes">
	<title>登录注册选择页面</title>
	<link rel="stylesheet" type="text/css" href="ocss/normalize.css" />
	<!--<link rel='stylesheet prefetch' href='http://fonts.useso.com/css?family=Open+Sans'>-->
	<link rel="stylesheet" type="text/css" href="ocss/styles.css">
	<script type="text/javascript" charset="utf-8" src="js/jquery-1.9.1.js"></script>
	<script type="text/javascript" charset="utf-8" src="js/gloal.js"></script>
	<!--[if IE]>
		<script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
	<![endif]-->
	
</head>
<body>
	<div class="cont">
	  <div class="demo">
	    <div class="login">
	    
	      <div class="login__check"></div>
	      <div class="login__form">
	        <div class="login__row">
	          <svg class="login__icon name svg-icon" viewBox="0 0 20 20">
	            <path d="M0,20 a10,8 0 0,1 20,0z M10,0 a4,4 0 0,1 0,8 a4,4 0 0,1 0,-8" />
	          </svg>
	          
	          <input type="text" id="mobile" name="mobile"class="login__input name" placeholder="mobile"/>
	        </div>
	        <div class="login__row">
	          <svg class="login__icon pass svg-icon" viewBox="0 0 20 20">
	            <path d="M0,20 20,20 20,8 0,8z M10,13 10,16z M4,8 a6,8 0 0,1 12,0" />
	          </svg>
	          <input type="password" name="passwd" id="passwd" class="login__input pass" placeholder="Password"/>
	        </div>
	        <button type="button" class="login__submit" id="login_submit" onclick="login();">登 录</button>
	        <p class="login__signup">还没有账号? &nbsp;<a href="regist.html">立刻注册</a></p>
	      </div>
	    </div>
	    
	    <div class="app">
	      <div class="app__top">
	        <div class="app__menu-btn">
	          <span></span>
	        </div>
	        <svg class="app__icon search svg-icon" viewBox="0 0 20 20">
	          <!-- yeap, its purely hardcoded numbers straight from the head :D (same for svg above) -->
	          <path d="M20,20 15.36,15.36 a9,9 0 0,1 -12.72,-12.72 a 9,9 0 0,1 12.72,12.72" />
	        </svg>
	        <p class="app__hello">Good Morning!</p>
	        <div class="app__user">
	          <img src="ocss/joyWJEY.jpg" alt="" class="app__user-photo" />
	          <span class="app__user-notif">3</span>
	        </div>
	        <div class="app__month">
	          <span class="app__month-btn left"></span>
	          <p class="app__month-name">March</p>
	          <span class="app__month-btn right"></span>
	        </div>
	      </div>
	      <div class="app__bot">
	        <div class="app__days">
	          <div class="app__day weekday">Sun</div>
	          <div class="app__day weekday">Mon</div>
	          <div class="app__day weekday">Tue</div>
	          <div class="app__day weekday">Wed</div>
	          <div class="app__day weekday">Thu</div>
	          <div class="app__day weekday">Fri</div>
	          <div class="app__day weekday">Sad</div>
	          <div class="app__day date">8</div>
	          <div class="app__day date">9</div>
	          <div class="app__day date">10</div>
	          <div class="app__day date">11</div>
	          <div class="app__day date">12</div>
	          <div class="app__day date">13</div>
	          <div class="app__day date">14</div>
	        </div>
	        <div class="app__meetings">
	          <div class="app__meeting">
	            <img src="ocss/joyWJEY.jpg" alt="" class="app__meeting-photo" />
	            <p class="app__meeting-name">Feed the cat</p>
	            <p class="app__meeting-info">
	              <span class="app__meeting-time">8 - 10am</span>
	              <span class="app__meeting-place">Real-life</span>
	            </p>
	          </div>
	          <div class="app__meeting">
	            <img src="ocss/joyWJEY.jpg" alt="" class="app__meeting-photo" />
	            <p class="app__meeting-name">Feed the cat!</p>
	            <p class="app__meeting-info">
	              <span class="app__meeting-time">1 - 3pm</span>
	              <span class="app__meeting-place">Real-life</span>
	            </p>
	          </div>
	          <div class="app__meeting">
	            <img src="ocss/joyWJEY.jpg" alt="" class="app__meeting-photo" />
	            <p class="app__meeting-name">FEED THIS CAT ALREADY!!!</p>
	            <p class="app__meeting-info">
	              <span class="app__meeting-time">This button is just for demo ></span>
	            </p>
	          </div>
	        </div>
	      </div>
	      <div class="app__logout">
	        <svg class="app__logout-icon svg-icon" viewBox="0 0 20 20">
	          <path d="M6,3 a8,8 0 1,0 8,0 M10,0 10,12"/>
	        </svg>
	      </div>
	    </div>
	  </div>
	</div>
	<script src='js/stopExecutionOnTimeout.js?t=1'></script>
	<script src='http://apps.bdimg.com/libs/jquery/1.11.1/jquery.min.js'></script>
	<script>
	window.onload=function(){
	    var mobile =  localStorage.mobile;
        var passwd =  localStorage.passwd;
   <!--      if(mobile==''||passwd==''){
            
        }else{
         //自动登录
          window.location.href="location.html"; 
        } -->
	}
	function login(){
	   var mobile = window.document.getElementById("mobile").value;
	   var passwd = window.document.getElementById("passwd").value;
	   
	   $.ajax( {  
          url:'http://'+window.ipaddress+'/location/rest',// 跳转到 action  
          data:{  
               transcode:'000001',
               mobile:mobile,
               passwd:passwd,
			   ajax:'ajax'
          },  
     	type:'post',  
     	//cache:false,  
     	dataType:'text',  
    	success:function(data) { 
            if(data =="success" ){  
             // view("修改成功！");  
              alert("登录成功！");  
              localStorage.mobile=mobile;
              localStorage.passwd=passwd;
              window.location.href="location.html"; 
         }else{  
		      $("#login_submit").removeClass('processing');
		       alert("用户名或者密码错误！");  
             
         }  
       },  
       error : function(data) { 
            // view("异常！");
            $("#login_submit").removeClass('processing');			
           alert("异常！");  
     }  
 });
	 //  window.location.href="http://ding:8080/location/rest?transcode=000001&mobile="+mobile+"&passwd="+passwd;
	   
	}
	$(document).ready(function () {
	    var animating = false, submitPhase1 = 1100, submitPhase2 = 400, logoutPhase1 = 800, $login = $('.login'), $app = $('.app');
	    function ripple(elem, e) {
	        $('.ripple').remove();
	        var elTop = elem.offset().top, elLeft = elem.offset().left, x = e.pageX - elLeft, y = e.pageY - elTop;
	        var $ripple = $('<div class=\'ripple\'></div>');
	        $ripple.css({
	            top: y,
	            left: x
	        });
	        elem.append($ripple);
	    }
	    ;
	    $(document).on('click', '.login__submit', function (e) {
	        if (animating)
	            return;
	        animating = true;
	        var that = this;
	        setTimeout(ripple($(that), e),1000);
	        $(that).addClass('processing');
			//
	        //setTimeout(function () {
	          //  $(that).addClass('success');
	            //setTimeout(function () {
	              //  $app.show();
	               // $app.css('top');
	               // $app.addClass('active');
	            //}, submitPhase2 - 70);
	            //setTimeout(function () {
	             //   $login.hide();
	             //   $login.addClass('inactive');
	             //   animating = false;
	             //   $(that).removeClass('success processing');
	           // }, submitPhase2);
	      //  }, submitPhase1);
	    });
	    $(document).on('click', '.app__logout', function (e) {
	        if (animating)
	            return;
	        $('.ripple').remove();
	        animating = true;
	        var that = this;
	        $(that).addClass('clicked');
	        setTimeout(function () {
	            $app.removeClass('active');
	            $login.show();
	            $login.css('top');
	            $login.removeClass('inactive');
	        }, logoutPhase1 - 120);
	        setTimeout(function () {
	            $app.hide();
	            animating = false;
	            $(that).removeClass('clicked');
	        }, logoutPhase1);
	    });
	});
	</script>
</body>
</html>